<template>
    <div class="addMenus">
        <el-dialog title="提示" :visible.sync="centerDialogVisible" width="50%" center :before-close="handleClose">
            <div class="content">
                <el-form ref="formBox" :model="form" :rules="rules" label-width="80px">
                    <el-form-item label="工号" prop="teacNum">
                        <el-input v-model="form.teacNum"></el-input>
                    </el-form-item>
                    <el-form-item label="名称" prop="teacName">
                        <el-input v-model="form.teacName"></el-input>
                    </el-form-item>
                    <el-form-item label="年龄" prop="teacAge">
                        <el-input v-model="form.teacAge"></el-input>
                    </el-form-item>
                    <el-form-item label="职称" prop="teacTitle">
                        <el-radio-group v-model="form.teacTitle">
                            <el-radio label="1">教授</el-radio>
                            <el-radio label="0">教师</el-radio>
                        </el-radio-group>
                    </el-form-item>
                    <el-form-item label="编制" prop="teacCompile">
                        <el-radio-group v-model="form.teacCompile">
                            <el-radio label="1">外编</el-radio>
                            <el-radio label="0">正编</el-radio>
                        </el-radio-group>
                    </el-form-item>
                </el-form>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="sub(0)">取 消</el-button>
                <el-button type="primary" @click="sub(1)">确 定</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
import { addTeacherInfo, updateTeacherInfo } from "../../api/user";
export default {
    data() {

        return {
            centerDialogVisible: false,
            form: {
                "teacNum": "",
                "teacName": "",
                "teacTitle": "",
                "teacCompile": "",
                "teacAge": "",
            },
            rules: {
                teacNum: [
                    {
                        required: true,
                        message: "请填写用户姓名",
                        trigger: "blur",
                    },
                ],
            },
            data: [],
            defaultProps: {
                children: 'children',
                label: 'label'
            }
        };
    },
    props: {
        isShow: {
            type: Boolean,
            default: false,
        },
        tracherInfo: {
            type: Object,
            default: null,
        },
    },
    watch: {
        isShow(n, o) {
            this.centerDialogVisible = n;
        },
        tracherInfo(n, o) {
            if (n == null) {
                this.form = {
                    "teacNum": "",
                    "teacName": "",
                    "teacTitle": "",
                    "teacCompile": "",
                    "teacAge": "",
                };
            } else {
                n.isStatus = n.isStatus == "1" ? false : true
                this.form = n;
            }
        },
    },
    created() {
    },
    methods: {
        //提交关闭按钮
        sub(t) {
            if (t == 1) {
                this.$refs.formBox.validate((valid) => {
                    if (valid) {
                        //加载
                        const loading = this.$loading({
                            lock: true,
                            text: "Loading",
                            spinner: "el-icon-loading",
                            background: "rgba(0, 0, 0, 0.7)",
                        });
                        // this.form.isStatus = this.form.isStatus ? "0" : "1";
                        // loading.close();
                        if (
                            this.form.id == undefined ||
                            this.form.id == ""
                        ) {
                            //添加
                            addTeacherInfo(this.form).then((res) => {
                                console.log("add", res);
                                this.resetFun();
                                this.$emit("refreshBox");
                                loading.close();
                            });
                        } else {
                            //更新
                            updateTeacherInfo(this.form).then((res) => {
                                console.log("update", res);
                                this.resetFun();
                                this.$emit("refreshBox");
                                loading.close();
                            });
                        }
                    } else {
                        console.log("error submit!!");
                        return false;
                    }
                });
            } else {
                this.centerDialogVisible = false;
                this.$emit("show");
                console.log("no");
            }
        },
        handleClose(done) {
            this.centerDialogVisible = false;
            this.$emit("show");
        },
        //重置表单
        resetFun() {
            this.$refs.formBox.$el.reset();
            this.form.isStatus = true
            this.centerDialogVisible = false;
            this.$emit("show");
        },

    },
};
</script>

<style lang="scss" scoped>
.addMenus {
    .content {
        .el-form {
            .el-form-item:last-child {
                .el-tree {
                    max-height: 200px;
                    overflow: auto;
                    padding: 10px 0;
                }
            }
        }
    }
}
</style>
